﻿@model OrderControllerModel.Address
<div class="modal-dialog">
    <div class="modal-content">
        @using (Html.BeginForm("address", "order", FormMethod.Post, new { @class = "form-horizontal", role = "form" }))
        {
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                    &times;</button>
                <h4 class="modal-title">
                    修改收货信息</h4>
            </div>
            <div class="modal-body">
                @if (Model.Order.Status != OrderStatus.WaitSellerSend)
                {
                    <div class="status-box status-box-warm-alert">
                        <div class="status-icon">
                            <div class="row">
                                <div class="col-md-2">
                                    <i class="icon-exclamation-sign icon-3x"></i>
                                </div>
                                <div class="col-md-10">
                                    <strong>该订单当前状态不可修改收货地址！</strong></div>
                            </div>
                        </div>
                    </div>
                }
                else
                { 
                    <div class="alert alert-info">
                        <p>
                            <strong>原收货信息：</strong><span>@(Model.Order.Receiver)</span> <span>@(Model.Order.Mobile)
                                @(Model.Order.Phone.IsNullOrEmpty() ? string.Empty : "（" + Model.Order.Phone + "）")</span></p>
                        <p>
                            @(Model.Order.Province)
                            @(Model.Order.City)
                            @(Model.Order.District)
                            @(Model.Order.Address)
                            (@(Model.Order.PostalCode))
                        </p>
                    </div>
                    <p>
                        <strong>新收货信息：</strong></p>
                    <div>
                        <div class="form-group">
                            <label for="receiver-name" class="col-md-2 control-label">
                                收货人
                            </label>
                            <div class="col-md-5">
                                <input id="receiver-name" name="receiver.name" type="text" class="form-control" maxlength="8" value="@(Model.Order.Receiver)" />
                            </div>
                            <div class="col-md-5">
                                <p class="help-block">
                                    收货人真实姓名</p>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="receiver-phone" class="col-md-2 control-label">
                                所在地区
                            </label>
                            <div class="col-md-10">
                                @Html.DropDownList("receiver.province", Model.Province, new { id = "receiver-province", @class = "input-medium", onchange = "areaChange(this)" })
                                @Html.DropDownList("receiver.city", Model.City, new { id = "receiver-city", @class = "input-medium", onchange = "areaChange(this)" })
                                @Html.DropDownList("receiver.district", Model.District, new { id = "receiver-district", @class = "input-medium", onchange = "areaChange(this)" })
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="receiver-address" class="col-md-2 control-label">
                                收货地址
                            </label>
                            <div class="col-md-5">
                                <input id="receiver-address" name="receiver.address" type="text" class="form-control" maxlength="50" value="@(Model.Order.Address)" />
                            </div>
                            <div class="col-md-5">
                                <p class="help-block">
                                    街道地址（不需要填写省市区）</p>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="receiver-phone" class="col-md-2 control-label">
                                电话号码
                            </label>
                            <div class="col-md-5">
                                <input id="receiver-phone" name="receiver.phone" type="text" class="form-control" maxlength="17" value="@(Model.Order.Phone)" />
                            </div>
                            <div class="col-md-5">
                                <p class="help-block">
                                    格式：区号 - 电话号码 - 分机号</p>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="receiver-mobile" class="col-md-2 control-label">
                                手机号码
                            </label>
                            <div class="col-md-5">
                                <input id="receiver-mobile" name="receiver.mobile" type="text" class="form-control" maxlength="11" value="@(Model.Order.Mobile)" />
                            </div>
                            <div class="col-md-5">
                                <p class="help-block">
                                    电话和手机请至少填写一个</p>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="receiver-postalcode" class="col-md-2 control-label">
                                邮政编码
                            </label>
                            <div class="col-md-5">
                                <input id="receiver-postalcode" name="receiver.postalcode" type="text" class="form-control" maxlength="11" value="@(Model.Order.PostalCode)" />
                            </div>
                            <div class="col-md-5">
                                <p class="help-block">
                                    邮政编码</p>
                            </div>
                        </div>
                    </div>
                }
            </div>
            <div class="modal-footer">
                <p id="message" class="pull-left">
                </p>
                @if (Model.Order.Status == OrderStatus.WaitSellerSend)
                {
                    <input type="hidden" id="receiver-areaid" name="receiver.areaid" />
                    <button type="button" class="btn btn-primary" onclick="submitMemo(this.form)">
                        确 认</button>
                }
            </div>
        }
    </div>
</div>
@if (Model.Order.Status == OrderStatus.WaitSellerSend)
{
    @Url.Ayatta().StaticJs("china.area")

    <script type="text/javascript">
        function areaChange(obj) {
            var val = $(obj).val();
            if (val.length == 6) {
                var area = _.findWhere(ChinaAreas, { Id: val });
                $("#receiver-postalcode").val(area.Zip);
                $('#receiver-areaid').val(area.Id);
                return;
            }
            $("#receiver-postalcode").val('');
            var html = [];
            var areas = _.where(ChinaAreas, { ParentId: val });
            html.push("<option value=''>请选择</option>");
            _.each(areas, function (o) {
                html.push("<option value=" + o.Id + ">" + o.Name + "</option>");
            });

            if (val.length == 4) {
                $("#receiver-district").html(html.join(""));
            }
            if (val.length == 2) {
                $("#receiver-district").html("<option value=''>请选择</option>");
                $("#receiver-city").html(html.join(""));
            }
            $('select').select2();
        }
        function submitMemo(form) {
            var param = $(form).serialize();
            $.postJSON(form.action, param, function (result) {
                if (result.Status == false) {
                    $('#message', form).css('color', 'red').html(result.Message);
                }
                else {
                    $('#message', form).css('color', 'green').html("修改收货信息成功！");
                }
            });
        }
        $(function () {
            $('select').select2();
        });
    </script>
}
